<template>
  <div>
    <div class="content">
      <div class="dialog">
        <audio id="train-audio" ref="audioRef" :src="url" controls/>
      </div>
    </div>
  </div>
</template>

<script>
// import $ from 'jquery'

export default {
  props:{
    url:{
      type:String,
      default:""
    }
  },
  data () {
    return {
      showPlayMp3: false,
    }
  },
  created () {
    this.$bus.$on('playMP3', (params) => {
      console.log(params)
      this.showPlayMp3 = true;
      const audio = this.$refs.audioRef;
      audio.src = params.url;
      audio.play();
      this.$nextTick(() => {
        audio.play()
      })
    })
    this.$bus.$on('pauseMP3', () => {
      const audio = this.$refs.audioRef;
      audio.pause();
      audio.currenttime = 0;
      this.showPlayMp3 = false
    })
  },
}
</script>

